const HtmlWebpackPlugin = require("html-webpack-plugin");
const { Configuration } = require("webpack");
const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin"); //暴露模块或加载远程模块， 这个是webpack5自带的，实现联邦技术的必要条件

/**
 * @type {Configuration} //配置注解提示
 */

const config = {
  mode: "none",
  entry: "./index.js",
  output: {
    filename: "bundle.js",
  },
  devServer: {
    port: 9002,
  },
  plugins: [
    // 指定模板
    new HtmlWebpackPlugin({
      template: "./index.html",
    }),
    new ModuleFederationPlugin({
      name: "host", //名字可以随便起
      // 调用远程联邦模块，
      remotes: {
        //配置规则 remote 对应remote文件夹webpack配置的ModuleFederationPlugin里面的name
        //配置规则2 域名 远程项目的域名
        //配置规则3 remoteEntry.js -> 对应remote文件夹webpack配置的ModuleFederationPlugin里面的filename
        remote: "remote@http://192.168.1.23:9001/remoteEntry.js",
      },
    }),
  ],
};

module.exports = config;
